<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<link rel="stylesheet" href="../css/base.css">
	<link rel="stylesheet" href="css/xianshang1.css">
	<link rel="stylesheet" href="../js/swiper/swiper.min.css">
	<script src="../js/common.js"></script>
	<script src="../js/jquery-2.2.3.min.js"></script>
	<script src="../js/rem.js"></script>
	<script src="../js/vue.min.js"></script>
	<script src="../js/vue-resource.min.js"></script>
	<script src="../js/swiper/swiper.min.js"></script>
	<title>Document</title>
	<style>

	</style>
</head>

<body>
<!-- 主体 -->
<div id="app">
	<div class="top_container">
		<!-- 头部页面选项卡  -->
		<div class="header_container">
			<div class="top_header">
				<a href="xianshang.html" class="header_title">易物商城-线上</a>
			</div>
			<div class="top_header_bottom">
				<a href="xianxia.html" class="header_title" style="line-height:0.22rem;">线下</a>
			</div>
		</div>
		<!-- 搜索框 -->
		<div class="foreach_container">
			<input type="text" readonly class="top_foreach" placeholder="请输入搜索商品名" @click="foreach">
			<img class="top_for_img" src="img/top_foreach.png" alt="">
			<p class="top_img" @click="foreach">搜索</p>
		</div>
	</div>
	<!-- 轮播 -->
	<div class="top_carsouel">
		<div class="swiper-container">
			<div class="swiper-wrapper">
				<div class="swiper-slide">
					<img src="../img/index-ban1.png" alt="">
				</div>
			</div>
		</div>
	</div>
	<!-- 分类 -->
	<div class="top_classify">
		<ul class="top_classify_ul">
			<li>
				<a href="#">
					<img src="img/img09.png" alt="">
					<span>男装</span>
				</a>
			</li>
			<li>
				<a href="#">
					<img src="img/img09.png" alt="">
					<span>女装</span>
				</a>
			</li>
			<li>
				<a href="#">
					<img src="img/img09.png" alt="">
					<span>鞋靴</span>
				</a>
			</li>
			<li>
				<a href="#">
					<img src="img/img09.png" alt="">
					<span>数码</span>
				</a>
			</li>
			<li>
				<a href="#">
					<img src="img/img09.png" alt="">
					<span>箱包</span>
				</a>
			</li>
			<li>
				<a href="#">
					<img src="img/img09.png" alt="">
					<span>箱包</span>
				</a>
			</li>
			<li>
				<a href="#">
					<img src="img/img09.png" alt="">
					<span>箱包</span>
				</a>
			</li>
			<li>
				<a href="#">
					<img src="img/img09.png" alt="">
					<span>箱包</span>
				</a>
			</li>
			<li>
				<a href="#">
					<img src="img/img09.png" alt="">
					<span>箱包</span>
				</a>
			</li>
			<!--<li>-->
				<!--<a href="#">-->
					<!--<img src="img/img09.png" alt="">-->
					<!--<span>箱包</span>-->
				<!--</a>-->
			<!--</li>-->
		</ul>
	</div>
	<!-- 内容 -->
	<div class="top_content">

		<!-- 商家 -->
		<div class="top_shop">
			<p class="top_shop_title">—— 好物推荐 ——</p>
			<a href="" class="shop_list" v-for="item in list" :data-id="item.shopId">
				<div class="shop_list_img">
					<img :src="item.logo" alt="">
				</div>
				<div class="shop_list_right">
					<p class="list_title">{{item.shopName}}</p>
					<p class="list_detail">{{item.goodsDetails}}</p>
				</div>
			</a>
		</div>
	</div>
	<div style="height: .6rem;"></div>
	<div class="foot" style="border: 0;">
		<div class="foot-item" onclick="location.href='../index/index.html'">
			<div class="f-i-i foot11"></div>
			<p class="isactive">首页</p>
		</div>
		<a href="../../aliancemerchant/index.html"></a>
		<div class="foot-item " onclick="location.href='../../aliancemerchant/index.html'" >
			<div class="f-i-i foot2"></div>
			<p>易物商城</p>
		</div>
		<div class="foot-item" onclick="location.href='../shopcar/indexShop.html'">
			<div class="f-i-i foot3 "></div>
			<p class="">购物车</p>
		</div>
		<div class="foot-item" onclick="location.href='../personal/index.html'">
			<div class="f-i-i isactive foot4"></div>
			<p class="">我的</p>
		</div>
	</div>
</div>
<script>
    new Vue({
        el: '#app',
        data: {
            list: [],
        },
        mounted: function () {
            this.$nextTick(function () {
                var _this = this;
                this.$http.post(SURL + '/jfd/shopGoods/onLineShop', {
                    emulateJSON: true
                }).then(function (res) {
                    console.log(res.body);
                    res.body.forEach(element => {
                        this.list = res.body;
                    });
                })
            })
        },
        methods:{
            foreach:function(){
                window.location.href="sousuo.html";
            }
        }
    })
    var mySwiper = new Swiper('.swiper-container', {
        autoplay: 2000, //可选选项，自动滑动
        loop: true,
        speed: 300,
    })
</script>
</body>

</html>
